<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>图书添加</title>
    <script src="https://cdn.bootcdn.net/ajax/libs/axios/0.27.2/axios.min.js"></script>
</head>

<body>
    <h2>添加图书</h2>
    <form>
        书名: <input type="text" name="name" id="name"><br />
        作者: <input type="text" name="author" id="author"><br />
        价格: <input type="number" name="price" id="price"><br />
        <input type="submit" value="提交" id="btn">
    </form>

    <script>
        const btn = document.getElementById('btn')

        btn.onclick = (e) => {
            e.preventDefault();

            // 收集数据
            const name = document.getElementById('name').value
            const author = document.getElementById('author').value
            const price = document.getElementById('price').value
            // 提交ajax请求添加图书
            // axios({
            //     url: 'http://localhost:9999/book',
            //     method: 'post',
            //     data: {name, author, price}
            // })
            axios.post('http://localhost:9999/book', {name, author, price})
            window.location = '/cient/books.html'

        }
    </script>
</body>

</html>